<template>
	<u-navbar height="40" :is-back="false" :background="background" :border-bottom="false">
		<!-- 带搜索功能navbar -->
		<view class="slot-search" v-if="isSearch">
			<view class="navbar_logo u-m-r-40">
				<!-- <u-image mode="aspectFit" width="200rpx" height="64rpx" src="https://lrcj.oss-cn-shenzhen.aliyuncs.com/images/common/20250606264432566427.png"></u-image> -->
				<!-- <u-image mode="aspectFit" width="200rpx" height="64rpx" src="https://lrcj.oss-cn-shenzhen.aliyuncs.com/images/common/20250703619680118657.png"></u-image>  -->
				<u-image mode="aspectFit" width="200rpx" height="84rpx" src="https://weilaijiuju.oss-cn-shenzhen.aliyuncs.com/images/common/20251024333291481886.png"></u-image> 
			</view>
			<view>
				<u-search v-model="keyword" :clearabled="false" bg-color="#F3F4F6" :show-action="false" :placeholder="`搜索青创私董/地址等`" @search="handleSearch" @clear="handleClearAll"></u-search>
			</view>
		</view>
		<!-- 二级页面navbar -->
		<view :class="!isReturn ? 'slot-logo' : 'slot-back-wrap'" v-else>
			<view class="left_item u-m-r-60 u-flex" v-if="isReturn">
				<u-icon @click="goback" name="arrow-left" color="#000000" size="40" />
				<view class="text_line" />
				<u-icon class="u-m-l-24" @click="goHome" name="home-fill" color="#000000" size="40" />
			</view>
			<view class="u-width-100 u-flex u-row-between u-p-l-20">
				<!-- <u-image v-if="!title" mode="aspectFit" width="200rpx" height="64rpx" src="https://lrcj.oss-cn-shenzhen.aliyuncs.com/images/common/20250703619680118657.png"></u-image> -->
				<u-image v-if="!title" mode="aspectFit" width="200rpx" height="84rpx" src="https://weilaijiuju.oss-cn-shenzhen.aliyuncs.com/images/common/20251024333291481886.png"></u-image>
        <view v-else class="u-text-24 title">{{title}}</view>
        <view class="u-flex-1"></view>
			</view>
		</view>
	</u-navbar>
</template>

<script>
	export default{
		props: {
      // 中间文字内容
      title:{
        type: String,
        default: ''
      },
			/* 搜索功能 */
			isSearch:{
				tpye: Boolean
			},
			/* 返回功能 */
			isReturn:{
				type: Boolean,
				default: true
			},
			/* 背景颜色 */
			background:{
				type: Object,
				// default: {backgroundColor: '#DAC09A'}
				default: {backgroundColor: '#f0f3f8'}
			},
			/* 二级返回页面 */
			backUrl:{
				type: String
			}
		},
		data(){
			return{
				keyword:''
			}
		},
		methods:{
			handleSearch(e){
				// this.$emit("search",e)
				uni.navigateTo({
					url: "/teaBureau/teaSearch/teaSearch?keyword=" + e
				})
			},
			handleClearAll(){
				this.$emit("clear")
			},
			handleFocus(){
				uni.navigateTo({
					url: "/teaBureau/teaSearch/teaSearch"
				})
			},
			goback(){
				if(this.backUrl){
					if(['home','group','demand','mine','news'].includes(this.backUrl)){
						uni.switchTab({
							url: `/pages/${this.backUrl}/${this.backUrl}`
						})
					}else{
						uni.redirectTo({
							url: this.backUrl
						})
					}
				}else{
					let pages = getCurrentPages()
					let prePage = pages[pages.length - 2]
					if (prePage) {
						uni.navigateBack({
							delta: 1
						})
					} else {
						uni.switchTab({
							url: "/pages/home/home"
						})
					}
				}
			},
			goHome(){
				getApp().globalData.switchCustom = true
				uni.switchTab({
					url:"/pages/home/home"
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
  .title {
    width: 200rpx;
    text-align: center;
    font-size: 32rpx;
    font-weight: bold;
  }
.slot-search{
		display: flex;
		align-items: center;
		padding: 0 20rpx;
	}
	
	.slot-back-wrap{
		display: flex;
		align-items: center;
		padding-left: 30rpx;
	}
	
	.slot-logo{
		width: 100%;
		display: flex;
		align-items: center;
		padding-right: 40rpx;
		justify-content: flex-end;
	}
	
	.left_item {
		border: solid 1rpx #d9d9d9;
		padding: 10rpx 20rpx 10rpx 16rpx;
		border-radius: 20px;
		background-color: rgba(255, 255, 255, 0.6);
		.text_line {
			border-left: solid 1rpx #d9d9d9;
			height: 36rpx;
			margin-left: 16rpx;
		}
	}
	
	.navbar_logo{
		width: 260rpx;
	}
</style>